//450X450,棋局对象
const chessUI = {
    /* canvas: null,//画布
    brush: null,//画笔
    nowCamp: 1,//当前行动方1黑2白
    nowChess: [],//当前棋局数据
    camp1:[],//输赢判断数组
    camp2:[],//输赢判断数组
    over:false,
    winner:0,//0平局,1黑2白
    prev:[],//上一个棋子
    wins: [],//所有赢法
    count:0,//赢法统计 */
    init(dom) {
        this.canvas = dom;
        this.brush = dom.getContext("2d");
        this.nowCamp = 1;
        this.over = false;
        this.winner = 0;
        this.initChess();
        this.getWins();
    },
    initChess() {//初始化棋局数据
        let arr = [];
        for (let i = 0; i < 15; i++) {
            arr[i] = Array(15).fill(0);
        }
        this.nowChess = arr;
        this.drawChess();
    },
    resetChess() {//重置数据
        this.drawChess();
        this.nowCamp = 1;
        this.over = false;
        this.winner = 0;
        this.initChess();
        this.camp1 = Array(this.count).fill(0);
        this.camp2 = Array(this.count).fill(0);
    },
    changeCamp() {//切换行动方
        this.nowCamp = this.nowCamp == 1 ? 2 : 1;
    },
    isOver(i, j) {//落子后判断结束
        if (this.over) return;
        for (const key in this.wins[i][j]) {
            this[`camp${this.nowCamp}`][key] += 1;
            this[`camp${this.nowCamp == 1 ? 2 : 1}`][key] = 6;//此赢法失效
            if (this[`camp${this.nowCamp}`][key] == 5) {
                this.over = true;
                this.winner = this.nowCamp;
                return;
            }
        }
        if (this.nowChess.every(it => it.every(v => v))) {//判断平局
            this.over = true;
            this.winner = 0;
        }
    },
    dropStep(i, j) {//落子
        if (this.nowChess[i][j] || this.over) return;
        console.log(this.nowCamp==1?'黑':'白',i,j);
        this.drawStep(i, j);
        this.nowChess[i][j] = this.nowCamp;
        this.isOver(i, j);
        if (this.over) return;
        this.changeCamp();
    },

    drawChess() {//画棋局
        this.canvas.width = this.canvas.width;
        this.brush.strokeStyle = "#555";//画笔的颜色
        for (var i = 0; i < 15; i++) {//通过循环画网格
            this.brush.moveTo(15, 15 + i * 30);
            this.brush.lineTo(435, 15 + i * 30);
            this.brush.stroke();
            this.brush.moveTo(15 + i * 30, 15);
            this.brush.lineTo(15 + i * 30, 435);
            this.brush.stroke();
        }
    },
    drawStep(i, j,flag=true) {//画棋子
        if(flag){
            if(this.prev){
                this.drawStep(...this.prev,false)
            }
            this.prev=[i,j];
        }
        
        this.brush.beginPath();
        this.brush.arc(15 + i * 30, 15 + j * 30, 13, 0, 2 * Math.PI);//圆心会变的，半径改为13
        this.brush.closePath();
        var gradient = this.brush.createRadialGradient(15 + i * 30 + 2, 15 + j * 30 - 2, 15, 15 + i * 30, 15 + j * 30, 0);
        if (this.nowCamp == (flag?1:2)) {
            gradient.addColorStop(0, "#0a0a0a");
            gradient.addColorStop(1, "#636766");
        } else {
            gradient.addColorStop(0, "#D1D1D1");
            gradient.addColorStop(1, "#F9F9F9");
        }
        this.brush.fillStyle = gradient;
        this.brush.fill();
        if(flag){
            this.brush.beginPath();
            this.brush.arc(15 + i * 30, 15 + j * 30, 12, 0, 2 * Math.PI);//圆心会变的，半径改为13
            this.brush.closePath();
            this.brush.strokeStyle = 'red';
            this.brush.stroke();
        }
    },
    getWins() {//获取所有赢法
        //赢法数组
        var wins = [];
        //三维数组
        for (var i = 0; i < 15; i++) {
            wins[i] = [];
            for (var j = 0; j < 15; j++) {
                wins[i][j] = {};
            }
        }
        //赢法统计  
        var count = 0;
        //横线
        for (var i = 0; i < 15; i++) {
            for (var j = 0; j < 11; j++) {
                for (var k = 0; k < 5; k++) {
                    //此循环结束，就是横向的第一种赢法
                    wins[i][j + k][count] = true;
                }
                count++;
            }
        }
        //纵线
        for (var i = 0; i < 15; i++) {
            for (var j = 0; j < 11; j++) {
                for (var k = 0; k < 5; k++) {
                    wins[j + k][i][count] = true;
                }
                count++;
            }
        }
        //正斜线
        for (var i = 0; i < 11; i++) {
            for (var j = 0; j < 11; j++) {
                for (var k = 0; k < 5; k++) {
                    wins[i + k][j + k][count] = true;
                }
                count++;
            }
        }
        //反斜线
        for (var i = 0; i < 11; i++) {
            for (var j = 14; j > 3; j--) {
                for (var k = 0; k < 5; k++) {
                    wins[i + k][j - k][count] = true;
                }
                count++;
            }
        }
        this.wins = wins;
        this.count = count;
        this.camp1 = Array(count).fill(0);
        this.camp2 = Array(count).fill(0);
        // console.log(wins, count)
    }
}

export default Object.create(chessUI);